import 'package:dance_todo/db/bean_event.dart';
import 'package:dance_todo/db/bean_record.dart';
import 'package:dance_todo/main.dart';
import 'package:dance_todo/pages/controller_home.dart';
import 'package:dance_todo/pages/page_trophy.dart';
import 'package:dance_todo/pages/page_schedule.dart';
import 'package:dance_todo/res/res_colors.dart';
import 'package:dance_todo/utils/utils_colors.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:lottie/lottie.dart';
import 'package:step_progress_indicator/step_progress_indicator.dart';
import 'dart:math';

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
  late final AnimationController _controller;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(vsync: this);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Material(
      color: Colors.black87,
      child: SafeArea(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            buildTitle(),
            const SizedBox(height: 30.0),
            Expanded(child: Center(child: buildCenterBody())),
            const SizedBox(height: 30.0),
            buildTapButton(),
            buildMenuRow(),
            SizedBox(height: 20.0),
          ],
        ),
      ),
    );
  }

  //notice 构建标题
  Widget buildTitle() {
    return Obx(() {
      Record record = HomeCtrl.to.selectRecord.value;
      return Container(
        child: Text(
          record.isEmpty() ? 'DanceTodo' : record.name!,
          style: TextStyle(
            color: Color.fromARGB(255, 27, 248, 163),
            fontSize: 70.0,
          ),
        ),
      );
    });
  }

  //notice 构建中间区域主体
  Obx buildCenterBody() {
    return Obx(() {
      var record = HomeCtrl.to.selectRecord.value;
      bool isEmpty = record.isEmpty();
      int doneCount = record.doneCount;
      int totalCount = record.totalCount;

      if (isEmpty) {
        return const Text(
          '练舞吧\n朋友！',
          style: TextStyle(
            color: ColorActiveRed,
            fontSize: 60.0,
          ),
        );
      }
      return CircularStepProgressIndicator(
        totalSteps: totalCount,
        currentStep: doneCount,
        stepSize: 20,
        selectedColor: Colors.red,
        unselectedColor: Colors.grey.withAlpha(100),
        customColor: (step) {
          if (step > doneCount) {
            return Colors.grey.withAlpha(50);
          } else {
            return getColor(Colors.red, Colors.purple, totalCount, step);
          }
        },
        padding: pi / 200,
        width: 300,
        height: 300,
        startingAngle: 0,
        arcSize: pi * 2,
        child: Container(
          child: Center(
            child: Text(
              '${doneCount >= totalCount ? "👏搞定👍" : doneCount}',
              style: TextStyle(
                color:
                    getColor(Colors.red, Colors.purple, totalCount, doneCount),
                fontSize: doneCount >= totalCount ? 50 : 120.0,
              ),
            ),
          ),
        ),
      );
    });
  }

  //notice 构建打卡按钮
  Widget buildTapButton() {
    return Obx(() {
      Record record = HomeCtrl.to.selectRecord.value;
      if (record.isEmpty()) {
        return Container();
      } else {
        return Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Container(
              child: GestureDetector(
                onTap: () async {
                  showVibrate();
                  record.doneCount = record.doneCount + 5;
                  if (record.doneCount >= record.totalCount) {
                    record.doneCount = record.totalCount;
                  }
                  HomeCtrl.to.saveRecord(record);
                  _controller.reset();
                  _controller
                    ..duration = const Duration(milliseconds: 800)
                    ..addListener(() {
                      if (_controller.value == 1) {
                        _controller.reset();
                      }
                    })
                    ..forward();
                },
                child: Container(
                  // decoration: BoxDecoration(
                  //   borderRadius: BorderRadius.circular(100.0),
                  //   color: Colors.grey.withAlpha(50),
                  // ),
                  child: Text(
                    '+5',
                    style: TextStyle(
                      fontSize: 30.0,
                      color: ColorActiveYellow,
                    ),
                  ),
                ),
              ),
            ),
            Container(
              child: GestureDetector(
                onTap: () async {
                  showVibrate();
                  record.doneCount = record.doneCount + 1;
                  if (record.doneCount >= record.totalCount) {
                    record.doneCount = record.totalCount;
                  }
                  HomeCtrl.to.saveRecord(record);
                  _controller.reset();
                  _controller
                    ..duration = const Duration(milliseconds: 800)
                    ..addListener(() {
                      if (_controller.value == 1) {
                        _controller.reset();
                      }
                    })
                    ..forward();
                },
                child: Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(100.0),
                    color: Colors.grey.withAlpha(50),
                  ),
                  child: Lottie(
                    composition: lottieLike,
                    width: 150.0,
                    height: 150.0,
                    fit: BoxFit.fill,
                    controller: _controller,
                  ),
                ),
              ),
            ),
            Container(
              child: GestureDetector(
                onTap: () async {
                  showVibrate();
                  record.doneCount = record.doneCount + 10;
                  if (record.doneCount >= record.totalCount) {
                    record.doneCount = record.totalCount;
                  }
                  HomeCtrl.to.saveRecord(record);
                  _controller.reset();
                  _controller
                    ..duration = const Duration(milliseconds: 800)
                    ..addListener(() {
                      if (_controller.value == 1) {
                        _controller.reset();
                      }
                    })
                    ..forward();
                },
                child: Container(
                  // decoration: BoxDecoration(
                  //   borderRadius: BorderRadius.circular(100.0),
                  //   color: Colors.grey.withAlpha(50),
                  // ),
                  child: Text(
                    '+10',
                    style: TextStyle(
                      fontSize: 30.0,
                      color: ColorActiveYellow,
                    ),
                  ),
                ),
              ),
            ),
          ],
        );
      }
    });
  }

  void showVibrate() async {
    HapticFeedback.heavyImpact();
  }

  Widget buildMenuRow() {
    return Container(
      child: Row(
        children: [
          GestureDetector(
            onTap: () {
              Get.to(() => TrophyPage());
            },
            child: Container(
              width: 120.0,
              height: 100.0,
              decoration: BoxDecoration(
                color: Colors.grey.withAlpha(50),
                borderRadius: const BorderRadius.only(
                  topRight: Radius.circular(100.0),
                  bottomRight: Radius.circular(100.0),
                ),
              ),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    '统计',
                    style: TextStyle(
                      color: ColorActiveRed,
                      fontSize: 40.0,
                    ),
                  ),
                ],
              ),
            ),
          ),
          Expanded(child: Container()),
          GestureDetector(
            onTap: () {
              Get.to(() => const SchedulePage())!.then((value) {
                HomeCtrl.to.getSelectRecord();
              });
            },
            child: Container(
              width: 120.0,
              height: 100.0,
              decoration: BoxDecoration(
                color: Colors.grey.withAlpha(50),
                borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(100.0),
                  bottomLeft: Radius.circular(100.0),
                ),
              ),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    '项目',
                    style: TextStyle(
                      color: ColorActiveRed,
                      fontSize: 40.0,
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}
